<template>
	<view class="scene-picture">
		<navBar title="现场照片"  @goBack="uni.navigateBack()"></navBar>
		
		<view v-if="fillRecordDetails" class="scene-picture-list">
			<view class="list-item" v-show="showTypeList.includes('qzdlz')">
				<view class="title">起重吊装作业照片</view>
				<u-upload @afterRead="event => addFile(event, 'hoistingFileArray')" @delete="event => deleteFile(event, 'hoistingFileArray')" :fileList="fillRecordDetails.hoistingFileArray" multiple :maxCount="9"></u-upload>
			</view>
			<!-- v-show="fillRecordDetails.flameOperationDoc" -->
			<view class="list-item" v-show="showTypeList.includes('dhxkz')">
				<view class="title">动火作业照片</view>
				<u-upload @afterRead="event => addFile(event, 'flameOperationFileArray')" @delete="event => deleteFile(event, 'flameOperationFileArray')" :fileList="fillRecordDetails.flameOperationFileArray" multiple :maxCount="9"></u-upload>
			</view>
			
			<view class="list-item" v-show="showTypeList.includes('yxkjzyspb')">
				<view class="title">有限空间作业照片</view>
				<u-upload @afterRead="event => addFile(event, 'confinedSpaceFileArray')" @delete="event => deleteFile(event, 'confinedSpaceFileArray')" :fileList="fillRecordDetails.confinedSpaceFileArray" multiple :maxCount="9"></u-upload>
			</view>
			
			<view class="list-item" v-show="showTypeList.includes('wxzysqb')">
				<view class="title">危险作业照片</view>
				<u-upload @afterRead="event => addFile(event, 'dangerFileArray')" @delete="event => deleteFile(event, 'dangerFileArray')" :fileList="fillRecordDetails.dangerFileArray" multiple :maxCount="9"></u-upload>
			</view>
		
			<view class="list-item" v-show="showTypeList.includes('dgzysqb')">
				<view class="title">登高作业照片</view>
				<u-upload @afterRead="event => addFile(event, 'climbingFileArray')" @delete="event => deleteFile(event, 'climbingFileArray')" :fileList="fillRecordDetails.climbingFileArray" multiple :maxCount="9"></u-upload>
			</view>
			
			<view class="list-item" v-show="fillRecordDetails.safetyPractice === 'y'">
				<view class="title">安全设施验收合格标识牌</view>
				<u-upload @afterRead="event => addFile(event, 'eligibilityCriteriaFileArray')" @delete="event => deleteFile(event, 'eligibilityCriteriaFileArray')" :fileList="fillRecordDetails.eligibilityCriteriaFileArray" multiple :maxCount="9"></u-upload>
			</view>
			
			<view class="list-item" v-show="fillRecordDetails.safetyPractice === 'y'">
				<view class="title">安全设施搭设验收记录表</view>
				<u-upload @afterRead="event => addFile(event, 'inspectionRecordFileArray')" @delete="event => deleteFile(event, 'inspectionRecordFileArray')" :fileList="fillRecordDetails.inspectionRecordFileArray" multiple :maxCount="9"></u-upload>
			</view>
			
			<view class="list-item">
				<view class="title">其他</view>
				<u-upload @afterRead="event => addFile(event, 'otherFileArray')" @delete="event => deleteFile(event, 'otherFileArray')" :fileList="fillRecordDetails.otherFileArray" multiple :maxCount="9"></u-upload>
			</view>
		</view>
		
		<view class="footer-button">
			<view class="button-placeholder"></view>
			
			<view class="button-group">
				<button @click="clickSubmit" :loading="isLoading" class="button-primary">提交</button>
			</view>
		</view>
	</view>
</template>

<script>
	import fileMixin from "@/mixins/file.js";
	import { imgFun } from "@/utils/common.js";
	import { saveFilleport } from "@/api/engineeringMaintenance/engineeringMaintenance.js";
	
	export default {
		mixins: [fileMixin],
		data() {
			return {
				// 当前页面的类型 - 0: 综合大修下的  1: 工程维保下的
				type: 0,
				// 填报记录详情
				fillRecordDetails: null,
				// 当前是否正在加载中...
				isLoading: false,
				// 记录原文件数据
				recordFileData: null,
				showTypeList:[]
			}
		},
		onLoad(options) {
			this.type = parseInt(options.type);
			this.getFillRecordDetails();
		},
		methods: {
			/** 获取填报记录详情数据 */
			async getFillRecordDetails() {
				if(uni.getStorageSync("_temp_fill_record_details")) {
					const data = uni.getStorageSync("_temp_fill_record_details");
					console.log(data,'-----');
					this.fillRecordDetails = {
						...data,
						hoistingFileArray: await this.getFileListByDocId(data.hoistingDoc),
						flameOperationFileArray: await this.getFileListByDocId(data.flameOperationDoc),
						confinedSpaceFileArray: await this.getFileListByDocId(data.confinedSpaceDoc),
						dangerFileArray: await this.getFileListByDocId(data.riskJobDoc),
						climbingFileArray: await this.getFileListByDocId(data.climbingDoc),
						eligibilityCriteriaFileArray: await this.getFileListByDocId(data.eligibilityCriteriaDoc),
						inspectionRecordFileArray: await this.getFileListByDocId(data.inspectionRecordDoc),
						otherFileArray: await this.getFileListByDocId(data.otherDoc),
					};
					// 记录原文件数据
					this.recordFileData = {
						hoistingFileArray: [...this.fillRecordDetails.hoistingFileArray], 
						flameOperationFileArray: [...this.fillRecordDetails.flameOperationFileArray], 
						confinedSpaceFileArray: [...this.fillRecordDetails.confinedSpaceFileArray],
						dangerFileArray: [...this.fillRecordDetails.dangerFileArray], 
						climbingFileArray: [...this.fillRecordDetails.climbingFileArray], 
						eligibilityCriteriaFileArray: [...this.fillRecordDetails.eligibilityCriteriaFileArray],  
						inspectionRecordFileArray: [...this.fillRecordDetails.inspectionRecordFileArray],  
						otherFileArray: [...this.fillRecordDetails.otherFileArray],  
					};
					uni.removeStorageSync("_temp_fill_record_details");
					if(this.fillRecordDetails.workPermit === 'y') {
						this.showTypeList = this.fillRecordDetails.workPermitList.map(item =>  item.workPermitName)
					}
				}
			},
		
			/** 添加文件 */
			async addFile(event, key, index) {
				for(const item of event.file) {
					this.fillRecordDetails[key].push({...item, url: await imgFun(item)});
				}
			},
			
			/** 删除文件 */
			deleteFile(event, key, index) {
				this.fillRecordDetails[key].splice(event.index, 1);
			},
		
			/** 上传文件 */
			async uploadFiles() {
				const { 
					hoistingFileArray, flameOperationFileArray, confinedSpaceFileArray, dangerFileArray, climbingFileArray, 
					eligibilityCriteriaFileArray, inspectionRecordFileArray, otherFileArray,
				} = this.fillRecordDetails;

				// 删除文件...
				for(const item of this.recordFileData.hoistingFileArray) {
					if(!hoistingFileArray.filter(item1 => item1.id).find(item1 => item1.id === item.id)) {
						await this.removeFileById(item.id);
					}
				}
				for(const item of this.recordFileData.flameOperationFileArray) {
					if(!flameOperationFileArray.filter(item1 => item1.id).find(item1 => item1.id === item.id)) {
						await this.removeFileById(item.id);
					}
				}
				for(const item of this.recordFileData.confinedSpaceFileArray) {
					if(!confinedSpaceFileArray.filter(item1 => item1.id).find(item1 => item1.id === item.id)) {
						await this.removeFileById(item.id);
					}
				}
				for(const item of this.recordFileData.dangerFileArray) {
					if(!dangerFileArray.filter(item1 => item1.id).find(item1 => item1.id === item.id)) {
						await this.removeFileById(item.id);
					}
				}
				for(const item of this.recordFileData.climbingFileArray) {
					if(!climbingFileArray.filter(item1 => item1.id).find(item1 => item1.id === item.id)) {
						await this.removeFileById(item.id);
					}
				}
				for(const item of this.recordFileData.eligibilityCriteriaFileArray) {
					if(!eligibilityCriteriaFileArray.filter(item1 => item1.id).find(item1 => item1.id === item.id)) {
						await this.removeFileById(item.id);
					}
				}
				for(const item of this.recordFileData.inspectionRecordFileArray) {
					if(!inspectionRecordFileArray.filter(item1 => item1.id).find(item1 => item1.id === item.id)) {
						await this.removeFileById(item.id);
					}
				}
				for(const item of this.recordFileData.otherFileArray) {
					if(!otherFileArray.filter(item1 => item1.id).find(item1 => item1.id === item.id)) {
						await this.removeFileById(item.id);
					}
				}
				
				// 新增文件...
				const docIdArray = await Promise.all([
					this.uploadFileList(hoistingFileArray.filter(item => !item.id), this.fillRecordDetails.hoistingDoc),
					this.uploadFileList(flameOperationFileArray.filter(item => !item.id), this.fillRecordDetails.flameOperationDoc),
					this.uploadFileList(confinedSpaceFileArray.filter(item => !item.id), this.fillRecordDetails.confinedSpaceDoc),
					this.uploadFileList(dangerFileArray.filter(item => !item.id), this.fillRecordDetails.riskJobDoc),
					this.uploadFileList(climbingFileArray.filter(item => !item.id), this.fillRecordDetails.climbingDoc),
					this.uploadFileList(eligibilityCriteriaFileArray.filter(item => !item.id), this.fillRecordDetails.eligibilityCriteriaDoc),
					this.uploadFileList(inspectionRecordFileArray.filter(item => !item.id), this.fillRecordDetails.inspectionRecordDoc),
					this.uploadFileList(otherFileArray.filter(item => !item.id), this.fillRecordDetails.otherDoc)
				]);
				const docProps = ["hoistingDoc", "flameOperationDoc", "confinedSpaceDoc", "riskJobDoc", "climbingDoc", "eligibilityCriteriaDoc", "inspectionRecordDoc", "otherDoc"];
				docIdArray.forEach((item, index) => {
					this.fillRecordDetails[docProps[index]] = item;
				});
			},
			
			/** 保存每日交底填报的内容 */
			handleSaveFilleport() {
				return new Promise(resolve => {
					const { id, hoistingDoc, flameOperationDoc, confinedSpaceDoc, riskJobDoc, climbingDoc, eligibilityCriteriaDoc, inspectionRecordDoc, otherDoc, safetyPractice, workPermit } = this.fillRecordDetails;
					
					let data = { 
						id,
						type: this.type === 1 ? "gcwb" : "zhdx",
						projectId: uni.getStorageSync("isOwner"),
						safetyPractice,
						workPermit,
					};
					if(hoistingDoc) {
						data.hoistingDoc = hoistingDoc;
					}
					if(flameOperationDoc) {
						data.flameOperationDoc = flameOperationDoc;
					}
					if(confinedSpaceDoc) {
						data.confinedSpaceDoc = confinedSpaceDoc;
					}
					if(riskJobDoc) {
						data.riskJobDoc = riskJobDoc;
					}
					if(climbingDoc) {
						data.climbingDoc = climbingDoc;
					}
					if(eligibilityCriteriaDoc) {
						data.eligibilityCriteriaDoc = eligibilityCriteriaDoc;
					}
					if(inspectionRecordDoc) {
						data.inspectionRecordDoc = inspectionRecordDoc;
					}
					if(otherDoc) {
						data.otherDoc = otherDoc;
					}
					
					saveFilleport(data).then(res => {
						uni.showToast({ title: res.message, icon: "none" });
						resolve();
					});
				});
			},
		
			/** 点击提交按钮 */
			async clickSubmit() {
				// 校验只是存在一项内容...
				const { hoistingFileArray, flameOperationFileArray, confinedSpaceFileArray, dangerFileArray, climbingFileArray, eligibilityCriteriaFileArray, inspectionRecordFileArray, otherFileArray } = this.fillRecordDetails;
				
				if(!hoistingFileArray.length && !flameOperationFileArray.length && !confinedSpaceFileArray.length  &&!dangerFileArray.length && !climbingFileArray.length && !eligibilityCriteriaFileArray.length && !inspectionRecordFileArray.length && !otherFileArray.length) {
					uni.showToast({ title: "至少上传一项内容", icon: "none" });
					return;
				}
				
				if(!this.isLoading) {
					this.isLoading = true;
					await this.uploadFiles();
					await this.handleSaveFilleport();
					this.isLoading = false;
					uni.navigateBack();
				}
			},
		}
	}
</script>

<style scoped lang="scss">
	.scene-picture {
		background: #f5f7fa;
		font-size: 32upx;
		min-height: 100vh;
		/* #ifdef MP-WEIXIN */
			padding-top: 200rpx;
		/* #endif */
		.scene-picture-list {
			padding-top: 30upx;
			
			.list-item {
				background: #fff;
				padding: 0 30upx 14upx;
				margin-bottom: 30upx;
				
				&:last-of-type {
					margin-bottom: 0;
				}
				
				.title {
					color: #445469;
					font-weight: bold;
					line-height: 44upx;
					padding: 28upx 0;
				}
			}
		}
	}
	
	.footer-button {
		height: 154upx;
		
		.button-placeholder {
			height: 100%;
		}
		
		.button-group {
			height: 154upx; 
			padding: 30upx; 
			box-sizing: border-box; 
			background: #fff; 
			position: fixed; 
			width: 100vw; 
			bottom: 0; 
			z-index: 1;
			
			.button-primary {
				background: #2f80ed; 
				border-radius: 4upx; 
				color: #fff; 
				font-weight: bold; 
				line-height: 92upx; 
				text-align: center;
			}
		}
	}
</style>
